<template>
	<view class="tipsBox">
		<view class="tipsBox-header ff-text-center">
			<image src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/ashd-no.png" mode="">
			</image>
			<view class="tipsBox-header-tip ff-color-fff ff-font-16">手机号码不存在{{asdPhone}}</view>
		</view>
		<view class="tipsBox-content ff-margin-12 ff-bg-fff ff-border-radius-10">
			<view class="tipsBox-content-title ff-margin-bottom-20 ff-flex ff-align-items-1 ff-flex-between">
				<view class="tipsL"></view>
				<view class="ff-color-blue ff-font-17 ff-font-weight-600">手机号码注册说明</view>
				<view class="tipsR"></view>
			</view>
			<view class="tipsBox-content-box ff-margin-bottom-15 ff-border-radius-10">
				<view class="ff-flex ff-align-items-1">
					<view class="tips1">1</view>
					<view class="ff-font-16 ff-font-weight-600">单位用户(发需求方)</view>
					<view class="tips2">可注册</view>
				</view>
				<view class="ff-font-13 ff-color-6B6B6B ff-margin-top-13">点击下方按钮进行注册</view>
			</view>
			<view class="tipsBox-content-box ff-margin-bottom-15 ff-border-radius-10">
				<view class="ff-flex ff-align-items-1">
					<view class="tips1">2</view>
					<view class="ff-font-16 ff-font-weight-600">机构用户(响应需求方)</view>
					<view class="tips3">不支持注册</view>
				</view>
				<view class="ff-font-13 ff-color-6B6B6B ff-margin-top-13 ff-line-height-1-5">
					如果存在账号，请确保当前手机号与<text class="ff-color-blue">“社会消防技术服务信息系统”</text>预留手机号一致。
				</view>
			</view>
			<view class="tipsBox-content-box ff-border-radius-10">
				<view class="ff-flex ff-align-items-1">
					<view class="tips1">3</view>
					<view class="ff-font-16 ff-font-weight-600">消防救援机构用户</view>
					<view class="tips3">不支持注册</view>
				</view>
				<view class="ff-font-13 ff-color-6B6B6B ff-margin-top-13 ff-line-height-1-5">
					如果存在账号，请确保当前手机号与<text class="ff-color-blue">“绩效系统”</text>预留手机号一致。
				</view>
			</view>
		</view>
		<view class="tipsBox-but" @click="unitStaffClick">单位用户注册</view>
		<!-- 多账号登录 -->
		<u-popup v-model="multiState" mode="bottom" :mask-close-able="false" :closeable="true" border-radius="40"
			:safe-area-inset-bottom="true">
			<view class="multi">
				<view class="multi-title ff-font-18 ff-font-weight-600 ff-text-center ff-margin-bottom-30">请选择本次登录的账号
				</view>
				<view class="multi-content ff-flex-between ff-bg-fff ff-border-radius-10 ff-margin-bottom-15"
					v-for="(item, index) of multiList" :key="index" @click="multiClick(item)">
					<view class="ff-align-items-one">
						<image src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/reg-3.png"
							mode="">
						</image>
						<view class="multi-content-info">
							<view class="ff-font-15 ff-margin-bottom-8 ff-line-height-1-3">{{ item.companyName }}</view>
							<view class="ff-font-13">{{ item.name }}</view>
						</view>
					</view>
					<view class="multi-content-select">
						<image v-show="item.id != loginSelectId"
							src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/no-select.png"
							mode="">
						</image>
						<image v-show="item.id == loginSelectId"
							src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/select.png"
							mode="">
						</image>
					</view>
				</view>
			</view>
		</u-popup>
		<f-loading ref="loading" />
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		encrypt
	} from '@/tools/sm.js'
	export default {
		data() {
			return {
				asdPhone: '', // 爱山东传过来的用户信息
				multiState: false, // 多账号登录弹框
				loginSelectId: '', // 多账号登录选中/未选中ID
				multiList: [], // 多账号登录数据列表
			}
		},
		onLoad(e) {
			console.log('参数', e)
			this.userInfo = JSON.stringify(e)
			const pages = getCurrentPages(); // 获取当前页面栈
			const currentPage = pages[pages.length - 1].$page.fullPath; // 获取当前页面路径11
			let result = currentPage.split("=")[1]; // 使用split分割后，取数组的第二个元素（索引为1）
			console.log(result); // 输出：data
			this.asdPhone = result || ''
			uni.setStorageSync('asdPhone', this.asdPhone);
			this.goLogin() // 去登录
		},
		onShow() {
			uni.hideHomeButton(); // 隐藏小房子
		},
		methods: {
			// 单位注册
			unitStaffClick() {
				this.$pageJump.navigateTo(
					'/pages/loginRegister/register/asdUnit/components/loginRegister');
			},
			// 去登录
			async goLogin() {
				const res = await this.$http.post({
					url: '/loginASD',
					data: {
						param: encrypt(this.asdPhone)
					}
				})
				if (res.code == 200 && res.success && res.data.multipleUsers !== null) {
					this.multiAccountLogin(params) // 多账号登录
				} else if (res.code == 200 && res.success) {
					this.setUserInfo(res.data.user); // 登录后获取的用户信息
					this.loginHandle(res.data.user); // 去登录
				} else if (res.code == 5101) {
					uni.showModal({
						title: '温馨提示',
						content: res.msg,
						confirmColor: '#3178FF',
						showCancel: false,
						success: function(res) {
							if (res.confirm) {}
						}
					})
				} else {
					this.$refs.uToast.show({
						title: res.msg,
						type: 'error'
					});
				}
				this.$refs.loading.closeLoading(); // 定义loadingTxt内容
			},
			// 多账号登录(账号密码)
			multiAccountLogin(e) {
				// console.log('多账号登录的信息列表--------', e);
				this.multiList = e.multipleUsers; // 账号列表赋值
				this.multiState = true; // 打开多账号登录弹框
			},
			// 多账号登录------选择某一个人员登录
			multiClick(item) {
				this.loginSelectId = item.id;
				this.$refs.loading.openLoading('登录中···');
				this.$http
					.post({
						url: '/multipleLoginASD',
						data: {
							param: encrypt(item.id)
						}
					})
					.then(res => {
						// console.log('多账号登录返回的数据---------', res);
						if (res.code == 200 && res.success) {
							this.setUserInfo(res.data.user); // 登录后获取的用户信息
							this.loginHandle(res.data.user); // 登录成功后判断人员类型
						} else {
							this.$refs.uToast.show({
								title: res.msg,
								type: 'error'
							});
						}
						this.$refs.loading.closeLoading();
					});
			},
			// 单账号登录后赋值操作
			loginHandle(uerInfo) {
				let userType = uerInfo.userType; // 1:监管人员  5:单位用户  8:维保人员  10:技术人员
				switch (userType) {
					case 1: // 监管人员
						// hasOwnProperty() 方法会返回一个布尔值，指示对象自身属性中是否具有指定的属性
						if (uerInfo.superviseStaff != null && uerInfo.hasOwnProperty('superviseStaff')) {
							// status：(0:未审核 1:已审核 5:已禁用)
							// staffType：(1:救援机构负责人, 2:救援机构专家 ,3:救援机构人员)
							let status = uerInfo.superviseStaff.status;
							let staffType = uerInfo.superviseStaff.staffType;
							if (status == 0) {
								//未审核
								uni.showModal({
									title: '温馨提示',
									content: '您的账号处于待审核状态，请联系您的单位确认审核后再登录！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
							} else if (status == 5) {
								//已禁用
								uni.showModal({
									title: '温馨提示',
									content: '您的账号已被禁用，请联系管理员！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
							} else if (status == 1) {
								uni.setStorageSync('isUserState', true); // 登录状态
								//已审核
								switch (staffType) {
									case 1: // 监管管理员
										this.setRoleStatus(4);
										break;
									case 2: // 监管员工
									case 3:
										this.setRoleStatus(5);
										break;
									default:
										break;
								}
								this.$pageJump.reLaunch('/pages/supervise/index'); // 跳转到监管页面
							} else {
								uni.showModal({
									title: '温馨提示',
									content: '您没有登录权限！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
							}
						} else {
							uni.showModal({
								title: '温馨提示',
								content: '请求服务失败，请及时联系管理员！',
								confirmColor: '#3178FF',
								showCancel: false,
								success: function(res) {
									if (res.confirm) {}
								}
							})
						}

						break;
					case 5: // 单位
						if (uerInfo.companyStaff != null && uerInfo.hasOwnProperty('companyStaff')) {
							let status = uerInfo.companyStaff.status;
							let staffType = uerInfo.companyStaff.staffType;
							if (status == 0) {
								//未审核
								uni.showModal({
									title: '温馨提示',
									content: '您的账号处于待审核状态，请联系您的单位确认审核后再登录！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
							} else if (status == 5) {
								// 已禁用
								uni.showModal({
									title: '温馨提示',
									content: '您的账号已被禁用，请联系管理员！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
							} else if (status == 1) {
								uni.setStorageSync('isUserState', true); // 登录状态
								// 已审核
								switch (staffType) {
									case 1: // 管理员
										this.setRoleStatus('0');
										break;
									case 5: // 员工
										this.setRoleStatus(1);
										break;
									default:
										break;
								}
								this.$pageJump.reLaunch('/pages/homeCentral/Central'); // 跳转到中心页面
							} else {
								uni.showModal({
									title: '温馨提示',
									content: '您没有登录权限！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
							}
						} else {
							uni.showModal({
								title: '温馨提示',
								content: '请求服务失败，请及时联系管理员！',
								confirmColor: '#3178FF',
								showCancel: false,
								success: function(res) {
									if (res.confirm) {}
								}
							})
						}
						break;
					case 8: // 维保人员
						if (uerInfo.orgStaff != null && uerInfo.hasOwnProperty('orgStaff')) {
							//机构员工
							let status = uerInfo.orgStaff.status;
							let staffType = uerInfo.orgStaff.staffType;
							if (status == 0) {
								//未审核
								uni.showModal({
									title: '温馨提示',
									content: '您的账号处于待审核状态，请联系您的机构确认审核后再登录！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
								return;
							} else if (status == 5) {
								//已禁用
								uni.showModal({
									title: '温馨提示',
									content: '您的账号已被禁用，请联系管理员！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
							} else if (status == 1) {
								uni.setStorageSync('isUserState', true); // 登录状态
								//已审核
								switch (staffType) {
									case 1: //管理员
										this.setRoleStatus(2);
										break;
									case 5: //员工
										this.setRoleStatus(3);
										break;
									default:
										break;
								}
								this.$pageJump.reLaunch('/pages/homeCentral/Central'); // 跳转到中心页面
							} else {
								uni.showModal({
									title: '温馨提示',
									content: '您没有登录权限！',
									confirmColor: '#3178FF',
									showCancel: false,
									success: function(res) {
										if (res.confirm) {}
									}
								})
							}
						} else {
							uni.showModal({
								title: '温馨提示',
								content: '请求服务失败，请及时联系管理员！',
								confirmColor: '#3178FF',
								showCancel: false,
								success: function(res) {
									if (res.confirm) {}
								}
							})
						}
						break;
					case 10: //技术人员
						uni.showModal({
							title: '温馨提示',
							content: '技术人员服务暂未开放！',
							confirmColor: '#3178FF',
							showCancel: false,
							success: function(res) {
								if (res.confirm) {}
							}
						})
						break;
					default:
						break;
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tipsBox {
		padding-bottom: 60rpx;

		&-header {
			width: 100%;
			height: 550rpx;
			background: linear-gradient(to bottom, #166EFF 60%, #F5F5F5);

			image {
				width: 186rpx;
				height: 100rpx;
				margin: 80rpx 0 34rpx;
			}
		}

		&-content {
			margin-top: -220rpx !important;
			padding: 40rpx 30rpx;

			&-box {
				background-color: #F7FBFF;
				padding: 32rpx 34rpx;
			}

			.tipsL {
				width: 150rpx;
				height: 2rpx;
				background: linear-gradient(to right, #fff 40%, #3178FF);
			}

			.tipsR {
				width: 150rpx;
				height: 2rpx;
				background: linear-gradient(to right, #3178FF, #fff 60%);
			}

			.tips1 {
				background: #166EFF;
				color: #fff;
				font-size: 26rpx;
				padding: 6rpx 10rpx;
				border-radius: 6rpx;
				margin-right: 8rpx;
			}

			.tips2 {
				background: #E7F1FF;
				color: #1678FF;
				font-size: 24rpx;
				padding: 12rpx 15rpx;
				border-radius: 10rpx;
				margin-left: 8rpx;
			}

			.tips3 {
				background: #FFEEEF;
				color: #F93A4A;
				font-size: 24rpx;
				padding: 12rpx 15rpx;
				border-radius: 10rpx;
				margin-left: 8rpx;
			}
		}

		&-but {
			margin: 10% 30rpx;
			background-color: #166EFF;
			color: #fff;
			font-size: 34rpx;
			text-align: center;
			padding: 30rpx;
			border-radius: 10rpx;
		}
	}
</style>